<template>
  <div class="app-container calendar-list-container">
        <el-form :model="addForm" label-width="100px" :rules="addFormRules" ref="addForm" class="number-hide" style="width:50%">
            <el-form-item label="网站名称" prop="webName">
              <el-input style="width:180px" :maxlength="20" v-model="addForm.webName" placeholder="网站名称" clearable/>
            </el-form-item>
            <el-form-item label="IP登录白名单（用英文,隔开）" prop="ipWhit">
                <el-input type="textarea" v-model="addForm.ipWhit" :rows="5"></el-input>
            </el-form-item>
          <el-form-item label="支付黑名单（用英文,隔开）" prop="ipBlack">
            <el-input type="textarea" v-model="addForm.ipBlack" :rows="5"></el-input>
          </el-form-item>
          <el-form-item label="谷歌令牌验证">
            <el-radio-group v-model="addForm.google">
              <el-radio label="1">开启</el-radio>
              <el-radio label="0">关闭</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="管理员只允许同时一处登录">
            <el-radio-group v-model="addForm.single">
              <el-radio label="1">是</el-radio>
              <el-radio label="0">否</el-radio>
            </el-radio-group>
          </el-form-item>
            <el-form-item>
                <el-button @click="handleSubmit" type="primary">保存</el-button>
                <el-button @click="handleReset" >重置</el-button>
            </el-form-item>
        </el-form>


  </div>
</template>

<script>
import { getNoticeList,sendNotice,addNotice,addNoticeWeb,delNotice,webList } from "@/api/notice";
import { parseTime } from "@/utils";
import { hasPermission } from '@/utils/auth' // 验权

export default {
  name: "noticeTable",
  data() {
    return {
        tableKey: 0,
        noticeList: null,
        listLoading: false,
        addFormVisible:false,
        addLoading: false,
        addFormRules: {
          webName: [{ required: true, message: "请输入内容", trigger: "blur" },{ min: 2, max: 10, message: '长度在 2 到 10 个字符', trigger: 'blur' }],
          ipWhit: [{ required: true, message: "请输入内容", trigger: "blur" },{ min: 2, max: 1000, message: '长度在 2 到 1000 个字符', trigger: 'blur' }],
          ipBlack: [{ required: true, message: "请输入内容", trigger: "blur" },{ min: 2, max: 1000, message: '长度在 2 到 1000 个字符', trigger: 'blur' }],
        },
        addForm: {
            id:null,
            webName:'111',
            ipWhit:'',
            ipBlack:'',
            google:'1',
            single:'1'
        }
    };
  },
  created() {
    this.getNoticeList();
  },
  methods: {
    hasPermission : hasPermission,
    getNoticeList() {
      this.listLoading = true;
      webList()
        .then(res => {
          this.addForm = res.map.list[0];
          this.addForm.google=this.addForm.google.toString();
          this.addForm.single=this.addForm.single.toString();
          this.listLoading = false;
        })
        .catch(() => {
          this.listLoading = false;
        });
    },
    handleSubmit(){
      this.$refs.addForm.validate(valid => {
        if (valid) {
          this.$confirm("确认提交吗？", "提示", {}).then(() => {
            this.addLoading = true;
            let para = this.addForm;

            addNoticeWeb(para)
              .then(res => {
                this.addLoading = false;
                this.$message({message: "保存成功",type: "success"});
                this.addForm.id = null;
                this.$refs["addForm"].resetFields();
                this.addFormVisible = false;
                this.getNoticeList();
              })
              .catch(() => {
                this.$message({message: "保存失败",type: "error"});
                this.addLoading = false;
              });
          });
        }
      });
    },
    handleReset(){
        this.addForm.id = null;
        this.$refs["addForm"].resetFields();
    }
  }
};
</script>
